<template>

	<div>
		<div class="app-container">
			<TopInfo />
			<Search :lookup="data.lookup" @investigate="inves" />
			<div>
				<el-button v-prmis="'sale_orders_export'" type="primary" @click="getExport">{{
					$t('marketing.preferential.exportOrder') }}</el-button>
				<!-- <el-button type="primary" @click="getBrandOrder">{{ data.order.supplier ?
					'查看全部订单' : '查看品牌方订单' }}</el-button> -->
			</div>
		</div>
		<div class="app-container" v-loading="data.mtloading">
			<el-table :key="updateKey" :ref="updateRef" :data="dataList" :header-cell-style="{ 'text-align': 'center' }"
				:cell-style="{ 'text-align': 'center' }" class="w-full" height="650">
				<el-table-column type="expand">
					<template #default="props">
						<el-table :data="props.row.details" :header-cell-style="{ 'text-align': 'center' }"
							:cell-style="{ 'text-align': 'center' }" class="w-full">

							<el-table-column prop="channel_code" :label="$t('public.code')" />

							<el-table-column prop="channel_position" :label="$t('order.consume.location')">
								<template #default="scope">
									{{ scope.row.channel_position == 1 ? $t('order.consume.main') :
										$t('order.consume.auxiliary') }}
								</template>
							</el-table-column>

							<el-table-column prop="g_name" :label="$t('machine.goods.name')" show-overflow-tooltip />

							<el-table-column prop="pic" :label="$t('machine.goods.pic')">
								<template #default="scope">
									<img class="w-20 h-20 inline-block" :src="scope.row.pic" />
								</template>
							</el-table-column>

							<el-table-column prop="retail_price" :label="$t('machine.channel.priceProduct')" />
							<el-table-column prop="out_sequence" :label="$t('order.consume.shipping')" />

							<el-table-column prop="quantity" :label="$t('order.consume.goodsNum')" />

							<el-table-column prop="success_quantity" :label="$t('order.consume.quantitySucces')" />

							<el-table-column prop="fail_quantity" :label="$t('order.consume.quantityFailures')" />

							<el-table-column prop="refund_quantity" :label="$t('order.consume.quantityRefund')" />

							<el-table-column :label="$t('public.operate')" width="200">
								<template #default="scope">
									<el-button size="small" type="warning"
										:disabled="props.row.isDisabled || scope.row.refund_quantity >= scope.row.quantity ? true : false || props.row.pay_type == 5"
										@click="sincere(scope.row)"
										:title="props.row.pay_type == '5' ? $t('order.consume.currentPay') : ''">
										{{ $t('order.consume.refund') }}
									</el-button>

									<el-button size="small" type="primary" @click="previewImg(scope.row)">
										{{ $t('order.consume.photo') }}
									</el-button>

									<el-button size="small" type="danger"
										@click="previewVideo(props.row.transaction_video, props.row.trade_no,)">
										{{ $t('source.video') }}
									</el-button>

								</template>
							</el-table-column>
						</el-table>
					</template>
				</el-table-column>

				<el-table-column prop="order_id" label="ID" width="60" />
				<el-table-column prop="machine_id" :label="$t('machine.code')" show-overflow-tooltip width="80">
					<template #default="scope">
						{{ scope.row.machine_id || '--' }}
					</template>
				</el-table-column>
				<el-table-column prop="machine_name" :label="$t('machine.name')" show-overflow-tooltip width="130" />
				<el-table-column prop="trade_no" :label="$t('marketing.preferential.orderCode')" width="160" />
				<el-table-column prop="mch_no" :label="$t('order.consume.payNum')" width="180" />

				<el-table-column prop="total_quantity" :label="$t('order.consume.ordersNum')" show-overflow-tooltip
					width="80" />
				<el-table-column prop="total_price" :label="$t('order.consume.payAmount')" width="90">
					<template #default="scope">
						{{ getPlevel.getmoney(scope.row.total_price) }}
					</template>
				</el-table-column>
				<el-table-column v-if="dataList.some(item => item.cost_price)" prop="cost_price" label="成本价" width="90">
					<template #default="scope">
						{{ getPlevel.getmoney(scope.row.cost_price) }}
					</template>
				</el-table-column>
				<el-table-column prop="discount_price" :label="$t('order.consume.discountAmount')" width="90">
					<template #default="scope">
						{{ getPlevel.getmoney(scope.row.discount_price) }}
					</template>
				</el-table-column>
				<el-table-column prop="retail_price" :label="$t('order.consume.totalAmount')" width="100">
					<template #default="scope">
						{{ getPlevel.getmoney(scope.row.retail_price) }}
					</template>
				</el-table-column>
				<el-table-column prop="out_status" :label="$t('order.goods.shipmentStatus')" width="120">
					<template #default="scope">
						<span v-if="scope.row.out_status == 1">{{ $t('order.goods.pendingPay') }}</span>
						<span v-if="scope.row.out_status == 2">{{ $t('order.goods.shipped') }}</span>
						<span v-if="scope.row.out_status == 3">{{ $t('order.goods.waiting') }}</span>
						<span v-if="scope.row.out_status == 4">{{ $t('message.shipmentSuccess') }}</span>
						<span v-if="scope.row.out_status == 5">{{ $t('message.shipmentFailed') }}</span>
						<span v-if="scope.row.out_status == 6">{{ $t('router.unclaimed') }}
							<el-icon v-if="!setUnclaimed(scope.row.unclaimed_status)">
								<Document />
							</el-icon>
							<el-popover class="box-item" :width="300" placement="top-start" v-else>
								<template #reference>
									<el-icon color="#409Eff">
										<Document />
									</el-icon>
								</template>
								<el-table :data="scope.row.unclaimed_status">
									<el-table-column width="100" property="channel_code" :label="$t('public.code')" />
									<el-table-column width="150" :label="$t('public.state')">
										<template #default="scopes">
											<span v-if="scopes.row.is_claim == 2">{{ $t('eventlog.nottaken.not') }} {{
												scopes.row.is_close == 2 || scopes.row.is_out == 2 ||
													scopes.row.is_match
													== 2
													? ' | ' : '' }}</span>
											<span v-if="scopes.row.is_close == 2">{{ $t('public.NotClose') }} {{
												scopes.row.is_out == 2 || scopes.row.is_match == 2 ? ' | ' : ''
											}}</span>
											<span v-if="scopes.row.is_match == 2">{{ $t('public.NotMatched') }}{{
												scopes.row.is_out == 2 ? ' | ' : '' }}</span>
											<span v-if="scopes.row.is_out == 2">{{ $t('public.NotShipped') }}</span>
										</template>
									</el-table-column>
								</el-table>
							</el-popover>

						</span>
					</template>
				</el-table-column>
				<el-table-column :label="$t('order.consume.orderStatus')" width="120">
					<template #default="scope">
						<el-tag v-if="scope.row.out_status == 1" type="success">{{ $t('public.normal') }}</el-tag>
						<el-tag v-if="scope.row.out_status == 2" type="warning">{{ $t('order.goods.shipped') }}</el-tag>
						<el-tag v-if="scope.row.out_status == 3" type="warning">{{ $t('order.goods.waiting') }}</el-tag>
						<div v-if="scope.row.out_status == 4">
							<el-tag v-if="scope.row.refund_status == 1" type="success">{{ $t('public.normal')
							}}</el-tag>
							<el-tag v-if="scope.row.refund_status == 2" type="danger">{{ $t('public.refunded')
							}}</el-tag>
							<el-tag v-if="scope.row.refund_status == 3" type="warning">{{ $t('public.refundFailed')
							}}</el-tag>
						</div>
						<el-tag v-if="scope.row.out_status == 5" type="danger">{{
							$t('message.shipmentFailed') }}</el-tag>
						<el-tag v-if="scope.row.out_status == 6" type="warning">{{ $t('router.unclaimed') }}</el-tag>
					</template>
				</el-table-column>


				<el-table-column prop="order_type" :label="$t('order.consume.orderType')" width="120">
					<template #default="scope">
						<el-tag
							:type="getPlevel.getPorder(scope.row.order_type) == $t('machine.custom.unknown') ? 'info' : ''">
							{{ $t(getPlevel.getPorder(scope.row.order_type)) }}
						</el-tag>
					</template>
				</el-table-column>
				<el-table-column prop="pay_type" :label="$t('machine.configs.payType')" width="120">
					<template #default="scope">
						<el-tag
							:type="getPlevel.getPpay(scope.row.pay_type) == $t('machine.custom.unknown') ? 'info' : ''">
							{{ $t(getPlevel.getPpay(scope.row.pay_type)) }}
						</el-tag>
					</template>
				</el-table-column>

				<el-table-column prop="pay_time" :label="$t('date.payTime')" width="180">
					<template #default="scope">
						{{ getPlevel.gettime(scope.row.pay_time, 3) }}
					</template>
				</el-table-column>

				<el-table-column prop="out_time" :label="$t('date.deliveryTime')" width="180">
					<template #default="scope">
						{{ getPlevel.gettime(scope.row.out_time, 3) }}
					</template>
				</el-table-column>
				<el-table-column prop="machine_id" :label="$t('order.consume.hotelInfo')" show-overflow-tooltip
					width="80">
					<template #default="scope">
						<span v-if="scope.row.has_hotel == 1" class="text-[#409EFF] cursor-pointer"
							@click="onDetailsHotel(scope.row)">{{ $t('public.details') }}</span>
						<span v-else>--</span>
					</template>
				</el-table-column>
				<el-table-column :label="$t('machine.addMachine.factory')" show-overflow-tooltip width="80">
					<template #default="scope">
						<span v-if="scope.row.factory" class="text-[#409EFF] cursor-pointer">{{ scope.row.factory
						}}</span>
						<span v-else>--</span>
					</template>
				</el-table-column>
				<el-table-column :label="$t('machine.addMachine.inventory_location')" show-overflow-tooltip width="80">
					<template #default="scope">
						<span v-if="scope.row.inventory_location" class="text-[#409EFF] cursor-pointer">{{
							scope.row.inventory_location }}</span>
						<span v-else>--</span>
					</template>
				</el-table-column>

			</el-table>
			<PageNum :total="data.total" :page="data.order" @exposeData="current" @fraction="fraction" />
		</div>
		<el-dialog v-model="data.dialogVisible" :title="$t('order.consume.orderRefund')" center width="30%">
			<el-form v-if="data.dialogVisible" :model="data.returnmoney" label-width="100px" ref="ruleFormRef">
				<el-form-item :label="$t('order.consume.quantityRefund') + ':'" prop="name">
					<el-select v-model="data.returnmoney.num" placeholder="Select" size="large">
						<el-option v-for="item in data.options" :key="item.value" :label="item.label"
							:value="item.value" />
					</el-select>
				</el-form-item>
				<el-form-item :label="$t('order.consume.remark') + ':'" prop="remark">
					<el-input v-model="data.returnmoney.remark" rows="{ minRows: 8, maxRows: 10 }" type="textarea"
						:placeholder="$t('message.pleaseEnter')" />
				</el-form-item>
				<el-form-item>
					<el-button type="primary" @click="submit()" :disabled="isDisabled"
						:class="isDisabled ? 'cursor-no-drop' : ''">{{ $t('public.save') }}</el-button>
					<el-button @click="data.dialogVisible = false">{{ $t('public.cancel') }}</el-button>
				</el-form-item>
			</el-form>
		</el-dialog>
		<el-dialog v-model="previewShow"
			:title="previewType == PreviewTypeEnums.IMG ? $t('order.consume.viewPic') : $t('order.consume.viewVideo')"
			center width="700px" destroy-on-close @close="previewShow = false">
			<span style="position: absolute;top: 21px;left: 60%;font-size: 16px;cursor: pointer;color: #409eff;"
				@click="downloadVideo(previewMedia.video, 'my-video.mp4')">下载</span>
			<div v-if="previewType == PreviewTypeEnums.IMG" class="flex justify-evenly">
				<div>
					<p class="text-center text-base">{{ $t('order.consume.before') }}</p>
					<el-image v-if="previewMedia.imgBefore" class="w-72 h-72" :src="previewMedia.imgBefore"
						fit="fill" />
					<div v-else class="bg-[#f5f7fa] w-72 h-72 text-[#a8abb2] text-center relative">
						<span class="previewMedia absolute">{{ $t('public.unData') }}</span>
					</div>
				</div>
				<div>
					<p class="text-center text-base">{{ $t('order.consume.after') }}</p>
					<el-image v-if="previewMedia.imgAfter" class="w-72 h-72" :src="previewMedia.imgAfter" fit="fill" />
					<div v-else class="bg-[#f5f7fa] w-72 h-72 text-[#a8abb2] text-center relative">
						<span class="previewMedia absolute">{{ $t('public.unData') }}</span>
					</div>
				</div>
			</div>

			<div v-if="previewType == PreviewTypeEnums.VIDEO">
				<Video v-if="previewMedia.video" :url="previewMedia.video" />
				<div v-else class="text-center"> {{ $t('public.unData') }}</div>
			</div>
		</el-dialog>
		<exports :dialogVisible="dialogExport" @close="dialogExport = false" />
		<!-- 酒店详情 -->
		<el-dialog v-model="isHotel" :title="$t('order.consume.infoDetails')" center width="70%" destroy-on-close
			@close="isHotel = false" append-to-body>
			<el-table :data="hotelList" :header-cell-style="{ 'text-align': 'center' }"
				:cell-style="{ 'text-align': 'center' }" class="w-full">
				<el-table-column :label="$t('order.consume.hotelSource')" width="80">
					<template #default="scope">
						{{ scope.row.hotelFrom == 1 ? $t('order.consume.ctripHotel') : scope.row.hotelFrom == 2 ?
							$t('order.consume.selfHotel') : '--' }}
					</template>
				</el-table-column>
				<el-table-column prop="roomId" :label="$t('order.consume.roomID')" show-overflow-tooltip width="100" />
				<el-table-column prop="totalPrice" :label="$t('order.consume.ordersTotal ')" width="130" />
				<el-table-column prop="pay_amount" :label="$t('order.consume.payAmount')" width="130" />
				<el-table-column :label="$t('order.consume.dailyPrice')" width="130">
					<template #default="scope">
						<span class="text-[#409EFF] cursor-pointer" @click="onDetailsNightly(scope.row)">{{
							$t('public.details') }}</span>
					</template>
				</el-table-column>
				<el-table-column prop="mobile" :label="$t('order.consume.tel')" width="120" />
				<el-table-column prop="num" :label="$t('goods.ctrips.rooms')" width="70" />
				<el-table-column prop="adults" :label="$t('order.consume.stayNum')" width="130" />
				<el-table-column prop="checkInDate" :label="$t('date.arrivalDate')" width="140">
					<template #default="scope">
						<span>{{ scope.row.checkInDate }}</span>
						<span v-if="scope.row.checkOutDate">~{{ scope.row.checkOutDate }}</span>
					</template>
				</el-table-column>
				<el-table-column prop="guestNames" :label="$t('order.consume.guests')" width="120" />
				<el-table-column prop="expectCheckInTime" :label="$t('order.consume.arrivalTime')" width="130">
					<template #default="scope">
						{{ getPlevel.gettime(scope.row.expectCheckInTime, 3) }}
					</template>
				</el-table-column>
				<el-table-column :label="$t('order.consume.placeOrder')">
					<template #default="scope">
						{{ scope.row.create_status == 0 ? $t('machine.custom.unknown') :
							scope.row.create_status == 1 ? $t('order.consume.orderSuccess') : scope.row.create_status == 2 ?
								$t('order.consume.orderFailed') : '--' }}
					</template>
				</el-table-column>
				<el-table-column prop="reservation_status" :label="$t('order.consume.reservationStatus')">
					<template #default="scope">
						{{ scope.row.reservation_status == 1 ? $t('order.consume.book') :
							scope.row.reservation_status == 2 ? $t('order.consume.bookSuccessful') :
								scope.row.reservation_status == 3 ? $t('order.consume.bookFailed') : '--'
						}}
					</template>
				</el-table-column>
				<el-table-column prop="create_time" :label="$t('date.createTime')" width="130">
					<template #default="scope">
						{{ getPlevel.gettime(scope.row.create_time, 3) }}
					</template>
				</el-table-column>
			</el-table>
		</el-dialog>
		<!-- 每日价格数据详情 -->
		<el-dialog v-model="isNightly" :title="$t('order.consume.infoDetails')" center width="600" destroy-on-close
			@close="isNightly = false" append-to-body>
			<el-table :data="nightlyList" :header-cell-style="{ 'text-align': 'center' }"
				:cell-style="{ 'text-align': 'center' }" class="w-full">
				<el-table-column prop="amount" :label="$t('order.consume.price')" />
				<el-table-column prop="hotelId" :label="$t('goods.ctrips.hotel') + 'ID'" />
				<el-table-column prop="roomId" :label="$t('order.consume.roomID')" />
				<el-table-column prop="effectiveDate" :label="$t('date.arrivalDate')"></el-table-column>
			</el-table>
		</el-dialog>
	</div>
</template>

<script lang="ts" setup>
import { useI18n } from 'vue-i18n'
const { t: $t } = useI18n()
import TopInfo from '@/components/TopInfo/index.vue';
import Search from '@/components/Search/index.vue';
import PageNum from '@/components/PageNum/index.vue';
import getPlevel from '@/utils/level'
import { useRoute } from "vue-router";
import { getOrderVideo, getordersList, getordersrefund, exportsaleorders } from '@/api/order';
import { getgroupList } from '@/api/machine_type';
import { onMounted } from 'vue'
import { ElMessage, ElMessageBox } from "element-plus";
import exports from '@/components/export.vue';
const dialogExport = ref(false)
let updateKey = ref(0)
const route = useRoute()
let isHotel = ref(false)
let isNightly = ref(false)
let isDisabled = ref(false)
const hotelList = ref([])
const nightlyList = ref([])
const dataList = ref([])
const updateRef = ref()
let data = reactive({
	rowSincere: {},
	mtloading: false, // 加载
	dialogVisible: false, // 弹窗
	demonstrate: false, // 监控弹窗
	lookup: [ // 筛选栏
		{ title: $t('machine.code'), type: 'mId', value: '', key: 'm_id' },
		{ title: $t('machine.name'), type: 'input', value: '', key: 'machine_name' },
		{ title: $t('marketing.preferential.orderCode'), type: 'input', value: '', key: 'trade_no' },
		{ title: $t('order.consume.payNum'), type: 'input', value: '', key: 'mch_no' },
		{
			title: $t('order.goods.pay'), type: 'linkage', select: [
				{
					value: '1V', label: $t('order.goods.onlinePay'), children: [
						{ value: '5', label: $t('order.goods.Member') },
						{ value: '6', label: $t('order.goods.LichengPay') },
						{ value: '7', label: $t('order.goods.RobotPay') }
					]
				},
				{
					value: '2V', label: $t('order.goods.offlinePay'), children: [
						{ value: '1', label: $t('order.goods.WeChatPay') },
						{ value: '2', label: $t('order.goods.alipayPay') },
						{ value: '4', label: $t('order.goods.JD') },
						{ value: '8', label: $t('order.goods.Cogolink') }
					]
				}
			], value: '', key: 'pay_type', strictly: true
		},
		{ title: $t('machine.addMachine.factory'), type: 'input', value: '', key: 'factory' },
		{ title: $t('machine.addMachine.inventory_location'), type: 'input', value: '', key: 'inventory_location' },
		{ title: $t('date.payTime'), type: 'time', value: '', key: 'pay_time' },
		{ title: $t('date.deliveryTime'), type: 'time', value: '', key: 'out_time' },
		{ title: $t('machine.group'), type: 'linkages', select: [], props: {}, value: '', key: 'machine_group_id', strictly: true },
		{
			title: $t('order.goods.shipmentStatus'), type: 'define', select: [
				{ label: $t('order.goods.pendingPay'), value: '1' },
				{ label: $t('order.goods.shipped'), value: '2' },
				{ label: $t('order.goods.waiting'), value: '3' },
				{ label: $t('message.shipmentSuccess'), value: '4' },
				{ label: $t('message.shipmentFailed'), value: '5' },
				{ label: $t('router.unclaimed'), value: '6' },

			], value: '', key: 'out_status'
		},
	],
	returnmoney: { // 退款信息
		order_id: '',
		remark: '',
		sod_id: '',
		num: 0
	},
	options: [], // 退款
	order: { // 筛选数据
		trade_no: '',
		mch_no: '',
		m_id: '',
		pay_type: '',
		pay_time: '',
		out_time: '',
		page: 1,
		pageNum: 15,
		supplier: true,
	},
	total: 0, // 总条数
	list: [], // 列表信息
	objcet: {
		type: 3,
		file_path: ''
	}
})
// 设备分组列表
const propsss = reactive(
	{
		checkStrictly: true,
		lazy: true,
		async lazyLoad(node: any, resolve: any) {
			const { level, value } = node
			let nodes = await getgroupList({ pid: value });
			if (nodes.state == 100 || nodes.state == 300) {
				resolve([]);
			}
			const nodesa = nodes.data.map((item) => ({
				value: item.mg_id,
				label: item.mg_id + '-' + item.mg_name
			}))
			resolve(nodesa);
		}
	}
)
data.lookup[9].props = propsss
onMounted(() => {
	let pay_time = ''
	let dates = [];
	if (route.query.id == '1') {
		let dateTime = new Date().getTime()
		let toDay = getPlevel.gettime(dateTime, 1)
		let dates = []
		dates[0] = toDay + ' ' + '00:00:00'
		dates[1] = toDay + ' ' + '23:59:59'
		data.lookup[5].value = dates
		pay_time = toDay + ' ' + '00:00:00' + '~' + toDay + ' ' + '23:59:59'
	}
	if (route.query.id == '2') {
		let today = new Date();
		for (var i = 0; i < 2; i++) {
			// 计算日期差值，向前推算日期
			var diff = new Date(today);
			diff.setDate(today.getDate() - i);
			dates.push(diff);
		}
		let dateTime = dates[dates.length - 1].getTime()
		let yesterDay = getPlevel.gettime(dateTime, 1)
		dates[0] = yesterDay + ' ' + '00:00:00'
		dates[1] = yesterDay + ' ' + '23:59:59'
		data.lookup[5].value = dates
		pay_time = yesterDay + ' ' + '00:00:00' + '~' + yesterDay + ' ' + '23:59:59'
	}
	if (route.query.type == 'discount') {
		data.order.order_type = '2,5'
	}
	getorders(pay_time)
})
const downloadVideo = (videoUrl, fileName) => {
	fetch(videoUrl).then(res => res.blob()).then(blob => {
		const a = document.createElement('a');
		document.body.appendChild(a)
		a.style.display = 'none'
		const url = window.URL.createObjectURL(blob);
		a.href = url;
		a.download = '订单视频.mp4';
		a.click();
		document.body.removeChild(a)
		window.URL.revokeObjectURL(url);
	})
		.catch(console.error);
}

// 使用示例
const setUnclaimed = (unclaimedList: any) => {
	let isUnclaimed = true
	unclaimedList.forEach((res) => {
		if (res.is_claim == 1 && res.is_close == 1 && res.is_out == 1 && res.is_match == 1) {
			isUnclaimed = false
		}
	})
	return isUnclaimed
}
let onDetailsNightly = (row: any) => {
	nightlyList.value = row.nightly
	isNightly.value = true
}
let onDetailsHotel = (row: any) => {
	hotelList.value = []
	hotelList.value.push(row.hotel)
	isHotel.value = true
}
// 获取列表信息
let getorders = (e) => {
	if (e) {
		data.order.create_date = e
	}
	data.mtloading = true
	getordersList(data.order).then(res => {
		console.log(res, 'res')
		data.mtloading = false
		if (res.state == 200) {
			dataList.value = res.data.data
			data.total = res.data.total
		}
	})
}

// 查询回调
let inves = (e) => {
	data.order.order_type = ''
	data.order.pay_time = ''
	data.order.out_time = ''
	for (let key in e) {
		if (key != 'pay_time' && key != 'out_time') {
			data.order[key] = e[key]
		}
	}

	if (e.pay_time != '') {
		data.order.pay_time = e.pay_time[0] + ' ' + '00:00:00' + '~' + e.pay_time[1] + ' ' + '23:59:59'
	}

	if (e.out_time != '') {
		data.order.out_time = e.out_time[0] + ' ' + '00:00:00' + '~' + e.out_time[1] + ' ' + '23:59:59'
	}
	if (e.pay_type.length) {
		if (e.pay_type.length == 1) {
			let child: any = []
			getPlevel.order_pay_child.forEach(item => {
				if (item.value == e.pay_type[0]) {
					item.children.forEach(ite => {
						child.push(ite.value)
					})
				}
			})
			data.order.pay_type = child.join(',')
		} else {
			data.order.pay_type = e.pay_type[1]
		}
	}
	data.order.machine_group_id = e.machine_group_id[e.machine_group_id.length - 1]
	data.order.page = 1
	data.order.pageNum = 15
	getorders('')
}

// 点击退款按钮
let sincere = (e) => {
	data.rowSincere = e
	data.dialogVisible = true
	data.returnmoney.order_id = e.order_id
	data.returnmoney.sod_id = e.sod_id
	data.returnmoney.num = e.quantity * 1 - e.refund_quantity * 1
	data.options = []
	for (let i = 1; i <= data.returnmoney.num; i++) {
		data.options.push({
			label: i,
			value: i
		})
	}
}

// 确认退款
let submit = () => {
	dataList.value.forEach(item => {
		if (data.rowSincere.order_id === item.order_id) {
			item.isDisabled = true
		}
	})
	data.dialogVisible = false
	data.trade_no = data.order.trade_no
	let refund = {
		sod_id: data.returnmoney.sod_id,
		quantity: data.returnmoney.num
	}
	let order = {
		order_id: data.returnmoney.order_id,
		refund: JSON.stringify(refund),
		remark: data.returnmoney.remark
	}
	getordersrefund(order).then(res => {
		if (res.state == 200) {

			ElMessage({
				message: $t('message.refundSuccess'),
				type: 'success'
			})
			setTimeout(() => {
				getorders('')
			}, 1000)
			return
		}
	}).catch(err => {
		dataList.value.forEach(item => {
			if (data.rowSincere.order_id === item.order_id) {
				item.isDisabled = false
			}
		})
		ElMessage({
			message: err.msg,
			type: 'error'
		})
	})

}

// 页数回调
let current = (e) => {
	data.order.page = e
	getorders('')
}

// 条数回调
let fraction = (e) => {
	data.order.pageNum = e
	getorders('')
}
// 导出
let getExport = () => {
	ElMessageBox.confirm($t('message.isExport')).then(res => {
		exportsaleorders(data.order).then(res => {
			if (res.state == 200) {
				dialogExport.value = true
				getorders('')
				return
			}
			ElMessage({
				message: $t('message.networkFailed'),
				type: 'error'
			})
		}).catch(err => {
			console.log(err)
		})
	}).catch(err => {
		console.log('取消')
	})
}
// 查看品牌方订单
let getBrandOrder = () => {
	data.order.supplier = !data.order.supplier
	getorders()
}
// 查看图片
enum PreviewTypeEnums {
	IMG,
	VIDEO
}
const previewShow = ref(false);
const previewType = ref(PreviewTypeEnums.IMG)
const previewMedia = reactive({
	imgBefore: '',
	imgAfter: '',
	video: ''
})

const previewImg = (row: any) => {
	let pics = row.deliver_pics
	let imgBefore = ''
	let imgAfter = ''
	try {
		const picList = pics.split(',')
		imgBefore = picList[0]
		imgAfter = picList[1]
	} catch (_) {
		ElMessage.error('查无信息')
		return
	}
	previewType.value = PreviewTypeEnums.IMG
	previewMedia.imgAfter = imgAfter
	previewMedia.imgBefore = imgBefore
	previewShow.value = true;
}

const previewVideo = async (video: string, orderNo: string) => {
	console.log(video, orderNo, 'video')
	data.mtloading = true
	if (video) {
		data.mtloading = false
		previewMedia.video = video
	} else {
		data.mtloading = false
		const res = await getOrderVideo(orderNo)
		if (!res.data.transaction_video) {
			ElMessage.info(res.msg)
			return
		} else {
			previewMedia.video = res.data.transaction_video
		}
	}
	previewType.value = PreviewTypeEnums.VIDEO
	previewShow.value = true;
}

</script>
<style lang="scss" scoped>
.previewMedia {
	top: 50%;
	margin-left: -10%
}
</style>
